<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>购物车首页</title>
    <link href="https://getbootstrap.com/docs/5.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <header>
          <div class="navbar navbar-dark bg-dark shadow-sm">
    <div class="container">
      <a href="#" class="navbar-brand d-flex align-items-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" aria-hidden="true" class="me-2" viewBox="0 0 24 24"><path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"/><circle cx="12" cy="13" r="4"/></svg>
        <strong>Liao Hongen</strong>
      </a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarHeader" aria-controls="navbarHeader" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
    </div>
  </div>
    </header>
</head>

<body>
 <div class="album py-5 bg-light">
    <div class="container">
 <div class="form-floating">
     <form method="POST" action="/ShoppingCart_result">
       <h4> <label for="floatingPassword">Alipay（输入余额有惊喜喔！）</label></h4>
      <input type="text" class="form-control"  name="Alipay">
<br>
    <button class="w-30 btn btn-lg btn-primary" type="submit">提交</button>
     </form>
    </div>
       <br>
      <div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3">
        <div class="col">
          <div class="card shadow-sm">
     <img class="currentImg" id="currentImg" onload="alog &amp;&amp; alog('speed.set', 'c_firstPageComplete', +new Date); alog.fire &amp;&amp; alog.fire('mark');" src="https://img14.360buyimg.com/pop/jfs/t1/172381/11/4922/28057/607b0625E8536ad8d/ac87f4ae4f3df562.jpg" width="293" height="293" style="top: 381px; left: 29px; width: 430px; height: 430px; cursor: pointer;" log-rightclick="p=5.102" title="点击查看源网页">
            <div class="card-body">
                <p class="card-text"><br>书名：放学后<br>作者：东野佳吾 <br>价格：103.56元</br>  【赠书签】放学后（精装版）东野佳吾成名作获江户川乱步奖 主人公在高中教书发现村桥老师中毒身亡，主人公找到凶手还遭人暗算，暗算的竟是他的妻子。</p>
                <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                  <button type="button" class="btn btn-sm btn-outline-secondary">立即购买</button>
                  <button type="button" class="btn btn-sm btn-outline-secondary">加入购物车</button>
                </div>
              </div>
              <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                </div>
                <small class="text-muted">2000+已购</small>
              </div>
            </div>
          </div>
        </div>
        <div class="col">
          <div class="card shadow-sm">
          <img class="currentImg" id="currentImg" onload="alog &amp;&amp; alog('speed.set', 'c_firstPageComplete', +new Date); alog.fire &amp;&amp; alog.fire('mark');" src="http://t13.baidu.com/it/u=2005901559,1175492605&amp;fm=224&amp;app=112&amp;f=JPEG?w=430&amp;h=430" width="276" height="276" style="top: 381px; left: 29px; width: 430px; height: 430px; cursor: pointer;" log-rightclick="p=5.102" title="点击查看源网页">
            <div class="card-body">
                <p class="card-text"><br>书名：时生<br>作者：东野佳吾<br>价格：88.9元</br> 正版时生 东野佳吾 超人气日剧给父亲口信原著作品给现代人久违的触动日本侦探/悬疑/推理小说。</p>
                       <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                  <button type="button" class="btn btn-sm btn-outline-secondary">立即购买</button>
                  <button type="button" class="btn btn-sm btn-outline-secondary">加入购物车</button>
                </div>
              </div>
              <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                </div>
                <small class="text-muted">1000+已购</small>
              </div>
            </div>
          </div>
        </div>
        <div class="col">
          <div class="card shadow-sm">
        <img class="currentImg" id="currentImg" onload="alog &amp;&amp; alog('speed.set', 'c_firstPageComplete', +new Date); alog.fire &amp;&amp; alog.fire('mark');" src="http://t14.baidu.com/it/u=3033395776,3530410117&amp;fm=224&amp;app=112&amp;f=JPEG?w=430&amp;h=430" width="293" height="293" style="top: 381px; left: 29px; width: 430px; height: 430px; cursor: pointer;" log-rightclick="p=5.102" title="点击查看源网页">
            <div class="card-body">
                <p class="card-text"><br>书名：悲剧人偶<br>作者：东野佳吾<br>价格：85.90元</br> 东野佳吾 悲剧人偶 讲述一个精妙的诡计，一个纯粹的烧脑解谜 日本推理侦探悬疑外国小说。</p>
                       <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                  <button type="button" class="btn btn-sm btn-outline-secondary">立即购买</button>
                  <button type="button" class="btn btn-sm btn-outline-secondary">加入购物车</button>
                </div>
              </div>
              <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                </div>
                <small class="text-muted">1500+已购</small>
              </div>
            </div>
          </div>
        </div>

        <div class="col">
          <div class="card shadow-sm">
           <img class="currentImg" id="currentImg" onload="alog &amp;&amp; alog('speed.set', 'c_firstPageComplete', +new Date); alog.fire &amp;&amp; alog.fire('mark');" src="https://img14.360buyimg.com/pop/jfs/t1/107116/35/10633/33241/5e7f0664Ebfd594f7/57e02c7c64cae28d.jpg" width="293" height="293" style="top: 381px; left: 29px; width: 430px; height: 430px; cursor: pointer;" log-rightclick="p=5.102" title="点击查看源网页">
            <div class="card-body">
                <p class="card-text"><br>书名：秘密<br>作者：东野佳吾<br>价格：98元</br> 秘密 全新译本精装典藏 东野佳吾 日本侦探悬疑原版小说 讲述男主公杉田平介妻子女儿遭遇车祸，妻子灵魂寄居在女儿体内到最终道出秘密。</p>
                       <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                  <button type="button" class="btn btn-sm btn-outline-secondary">立即购买</button>
                  <button type="button" class="btn btn-sm btn-outline-secondary">加入购物车</button>
                </div>
              </div>
              <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                </div>
                <small class="text-muted">2100+已购</small>
              </div>
            </div>
          </div>
        </div>
        <div class="col">
          <div class="card shadow-sm">
          <img class="currentImg" id="currentImg" onload="alog &amp;&amp; alog('speed.set', 'c_firstPageComplete', +new Date); alog.fire &amp;&amp; alog.fire('mark');" src="https://img14.360buyimg.com/pop/jfs/t1/191643/35/1473/56782/609243a8E7e9a3321/a88e994323f1caa4.jpg" width="293" height="293" style="top: 381px; left: 29px; width: 430px; height: 430px; cursor: pointer;" log-rightclick="p=5.102" title="点击查看源网页">
            <div class="card-body">
                <p class="card-text"><br>书名：生吞<br>作者：郑执<br>价格：50.9元</br> 生吞小说，匿名作家计划首奖 讲述北方一座小城发生的时隔十年前的两起命案，通过大量的侦查和推断，案件疑云逐渐揭晓。</p>
                       <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                  <button type="button" class="btn btn-sm btn-outline-secondary">立即购买</button>
                  <button type="button" class="btn btn-sm btn-outline-secondary">加入购物车</button>
                </div>
              </div>
              <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                </div>
                <small class="text-muted">1000+已购</small>
              </div>
            </div>
          </div>
        </div>
        <div class="col">
          <div class="card shadow-sm">
           <img class="currentImg" id="currentImg" onload="alog &amp;&amp; alog('speed.set', 'c_firstPageComplete', +new Date); alog.fire &amp;&amp; alog.fire('mark');" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201709%2F12%2F20170912120223_vuFSM.jpeg&amp;refer=http%3A%2F%2Fb-ssl.duitang.com&amp;app=2002&amp;size=f9999,10000&amp;q=a80&amp;n=0&amp;g=0n&amp;fmt=jpeg?sec=1643364075&amp;t=2bc5b45820aa38aadc1cafb75db6b7fe" width="293" height="293" style="top: 381px; left: 29px; width: 430px; height: 430px; cursor: pointer;" log-rightclick="p=5.102" title="点击查看源网页">
            <div class="card-body">
                <p class="card-text"><br>书名：白夜行<br>作者：东野佳吾<br>价格：88元</br> 白夜行东野佳吾精装版日本侦探悬疑推理犯罪心理学小说，讲述了14年前卷入杀人案件的一对彼此相爱男女，因摆脱一名警察不得已形同陌路。</p>
                       <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                  <button type="button" class="btn btn-sm btn-outline-secondary">立即购买</button>
                  <button type="button" class="btn btn-sm btn-outline-secondary">加入购物车</button>
                </div>
              </div>
              <div class="d-flex justify-content-between align-items-center">
                <div class="btn-group">
                </div>
                <small class="text-muted">3000+已购</small>
              </div>
            </div>
          </div>
        </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
</html>